import { Popup } from 'devextreme-react';
import React, { useEffect, useImperativeHandle, useRef, useState } from 'react';
import { intl } from "@/utils";
import CpasTableFs, { ImportToTitle } from '~/public/cpas-business/cpas-table/CpasTableFs';
import { useModel } from 'umi';
import notify from 'devextreme/ui/notify';
import PageLoading from '../PageLoading';

const CpasTablePupop = React.forwardRef((props: any, ref: any) => {
    const { initialState } = useModel('@@initialState');
    const { reloadDevTable } = props;
    const { cpasTableZeroReplace } = initialState?.settings;
    const [visible, setVisible] = useState<boolean>(false);
    const popupRef = useRef<any>(null);
    const [cpasTableName, setCpasTableName] = useState<string>('');
    const [cpasTableData, setCpasTableData] = useState<any>({});
    const [spinLoad, setSpinLoad] = useState<boolean>(false);

    const cpasTableFsRef = useRef<any>(null);

    const getRealCPASTableRef = () => {
        if (cpasTableFsRef) {
            const realHandSonGridRef = cpasTableFsRef.current.handsonTableFs.current;
            return realHandSonGridRef;
        }
    }

    const onOk = async () => {
        if (cpasTableName && cpasTableFsRef.current) {
            const realrealHandSonGridRefRef = getRealCPASTableRef();
            try {
                const res = await realrealHandSonGridRefRef.saveToServer(cpasTableName, 'fs');
                if (res) {
                    notify(`保存成功！`, "success", 2000);
                    reloadDevTable();
                } else {
                    notify(`保存失败！`, "success", 2000);
                }
                setVisible(false);
            } catch (error) {
                notify(`保存失败！`, "success", 2000);
            }

        }
    }

    const onCancel = () => {
        setVisible(false);
    }

    // 自定义方法
    useImperativeHandle(ref, () => ({
        showCpasTablePupop: (xlsxData: any, capsName: string) => {
            setVisible(true);
            setSpinLoad(true);
            setTimeout(() => {
                setCpasTableName(capsName);
                setCpasTableData(xlsxData);
            }, 300);
        },
    }));


    useEffect(() => {
        if (visible && cpasTableData.uid && cpasTableFsRef.current) {
            ImportToTitle(cpasTableData, cpasTableFsRef.current);
            setSpinLoad(false);
        }
    }, [visible, cpasTableData]);

    return (
        <>
            <Popup
                ref={popupRef}
                visible={visible}
                // title='提醒'
                {...props}
                width={900}
                height={600}
                // dragOutsideBoundary={true}
                // resizeEnabled={true}
                onHiding={() => {
                    setVisible(false);
                    setCpasTableData({});
                    setCpasTableName('');
                }}
                toolbarItems={[
                    {
                        widget: 'dxButton',
                        toolbar: 'bottom',
                        location: 'after',
                        options: {
                            text: intl('pub.cancel', '取消'),
                            onClick: () => onCancel()
                        },
                    },
                    {
                        widget: 'dxButton',
                        toolbar: 'bottom',
                        location: 'after',
                        options: {
                            text: intl('pub.ok', '确定'),
                            type: 'default',
                            onClick: () => onOk()
                        },
                    },

                ]}
                contentRender={() => (
                    <div style={{ height: '450px', width: '100%', overflow: 'hidden' }}>
                        {/* {spinLoad && <SpinLoading loadString="" />} */}

                        <PageLoading
                            isOpen={spinLoad}
                            isMaskClose={false}
                            content={""}
                            width={200}
                        />
                        <CpasTableFs
                            tabGroup="fs-tab"
                            tabLevel={1}
                            ieType="json"
                            numberZeroReplace={cpasTableZeroReplace}
                            type="fs"
                            name={cpasTableName}
                            // mapRowsList={rowsMapList}
                            // mapColumnsList={columnsMapList}
                            // isShowMenuToolBar={showMenuToolBar}
                            // gridData={copyServerData}
                            // tableDate={'2018年06月04日'}
                            // tableTitle={tableTitleName}
                            // tableRiDesc={`单位：${tableRiCurrency}`}
                            // tableLfDesc={`编制单位：${zcbfName}`}
                            isTest={true}
                            ref={cpasTableFsRef}
                        ></CpasTableFs>
                    </div>
                )}
            />
        </>
    );
});

export default CpasTablePupop;
